<div class="row-fluid">
    <div class="span12">

        <!-- ** widget ** -->
        <div class="well">

            <!-- ** widget header ** -->
            <div class="navbar navbar-heading">
                <div class="navbar-inner">
                    <div class="container" style="width: auto;">
                        <a class="brand" href="#">List Roles</a>
                        <ul class="nav pull-right">
                                <li><a href="#"><i class="icon-large icon-cog"></i></a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <!-- ** ./ widget header ** -->
            {% if roles|length > 0 %}
                        <table class="table">
				<tr>
					<th width="50">Id</th>
					<th width="100">Name</th>
					<th width="50">Actions</th>
				</tr>
                                {% for role in roles %}
				<tr>
                                    <td>{{role.id}}</td>
                                    <td>{{role.name}}</td>
                                    <td><a class="btn btn-mini btn-primary">Edit</a> <a class="btn btn-mini btn-danger">Delete</a></td>
				</tr>
                                {% endfor %}
			</table>
            {% else %}
            No resut
            {% endif %}

        </div>
        <!-- ** ./ widget ** -->

    </div>
</div>
